<template>
<a-spin :spinning="spinning">
      <van-nav-bar
        title="原/辅材收货"
    />
    <div class="layout">
        <van-form >
            <div class="title">
                <h3>单据信息</h3>
            </div>
            <van-cell-group inset>
                <van-field
                v-model="variables.postDate"
                name="事务处理日期"
                label="事务处理日期"
                />
                <van-field
                v-model="variables.receiptDate"
                name="收货日期"
                label="收货日期"
                />
                <van-field
                v-model="variables.supplierName"
                name="供应商"
                label="供应商"
                />
                <van-field
                v-model="variables.receiptUser"
                name="收货人"
                label="收货人"
                />
                <van-field
                v-model="variables.orderNo"
                name="订单号"
                label="订单号"
                />
            </van-cell-group>
             <div class="title">
                <h3>收货明细</h3>
            </div>
            <!-- //折叠面板 -->
            <van-collapse v-model="activeNames">
                <van-collapse-item
                 v-for="(item,index) in data"
                 :key="index"
                 :title="item.materialName"
                 :name="index+1"
                >
                <!-- 无子级 -->
                <div v-if="!item.showFlag">
                    <van-cell-group inset>
                        <div style="display:flex;">
                            <van-field
                            v-model="item.processRowCode"
                            name="行号"
                            label="行号"
                            />
                            <van-field
                            v-model="item.warehousingQuantity"
                            name="入库数量"
                            label="入库数量"
                            />
                        </div>
                    </van-cell-group>
                </div>
                <!-- 有子级 -->
                <div v-if="item.showFlag">
                    <van-cell-group inset>
                        <div style="display:flex;">
                            <van-field
                            v-model="item.processRowCode"
                            name="行号"
                            label="行号"
                            />
                            <van-field
                            v-model="item.water"
                            name="水分"
                            label="水分"
                            />
                        </div>
                        <div style="display:flex;">
                        <van-field
                            v-model="item.warehousingQuantity"
                            name="入库数量"
                            label="入库数量"
                        />
                            <van-field
                            v-model="item.enterQualityCode"
                            name="进厂质检"
                            label="进厂质检"
                            >
                                <template #input>
                                    <a @click="seeQuantity(item.enterQualityCode)" v-if="item.enterQualityCode">查看详情</a>
                                    <span v-if="!item.enterQualityCode">未质检</span>
                                </template>
                            </van-field>
                        </div>
                        <van-field
                            v-model="item.bottomQualityCode"
                            name="摸底质检"
                            label="摸底质检"
                            >
                                <template #input>
                                    <a @click="seeQuantity(item.bottomQualityCode)" v-if="item.bottomQualityCode">已使用（点击查看详情）</a>
                                    <span v-if="!item.bottomQualityCode">未使用</span>
                                </template>
                            </van-field>
                    </van-cell-group>
                </div>

                </van-collapse-item>
            </van-collapse>
            <div style="margin: 0.667rem;display:flex">
                <van-button round block type="primary" native-type="submit" style="width:4.167rem" @click="deal(2)">
                同意
                </van-button>
                <van-button round block loading-text="审批中..." type="primary" native-type="submit" style="width:4.167rem" @click="deal(3)">
                驳回
                </van-button>
            </div>
        </van-form>
    </div>
</a-spin>
</template>
<script lang="ts">
import { defineComponent,ref ,reactive} from 'vue';
import { get,post ,getQueryVariable} from "@/request/useRequest";
import options from "@/views/workflowConfig/yuanfucaishouhuoConfig";
import { workflow } from "@/utils/hooks/workflow";
import { Props } from '@/components/typing';
export default defineComponent({
  name: 'yuanfucaishouhuo',
  setup(){
    let variables:any=ref({})//传参用
    let data:any=ref([])//h5展示用
    let id=getQueryVariable("id")
    let formInfoId=getQueryVariable("formInfoId")
    const activeNames:any = ref([]);
    get('formInstance/getFormData',{id,formInfoId}).then((res:any)=>{
        if(res.status==200){
            variables.value=res.data.formData.variable.variables
            variables.value.list?.forEach((item:any)=>{
                if(!item.batchInfoList||item.batchInfoList.length<1){
                    data.value.push({
                        processRowCode:item.processRowCode,
                        materialName:item.materialName,
                        warehousingQuantity:item.warehousingQuantity,
                        showFlag:false
                    })
                }else{
                    item.batchInfoList?.forEach((i:any)=>{
                        data.value.push({
                            processRowCode:i.dataRowCode,
                            materialName:item.materialName, 
                            selected:item.selected,
                            bottomQualityCode:item.qualityCode,//摸底质检
                            enterQualityCode:i.invoiceCode,//入场质检
                            qualityType:item.qualityType,//是否使用摸底数据1:是，0:否
                            warehousingQuantity:i.invoiceSum,//子级检验数量=入库数量
                            water:i.water,
                            showFlag:true
                        })
                    })
                }
            })
            console.log(data.value,'data');
            activeNames.value=[]
            data.value.forEach((item:any,index:number)=>{
                activeNames.value.push(index+1)
            })
        }
        
        
    })
    const {
      deal,
      spinning,
    } = workflow(variables,options,true);
    const seeQuantity=(qualityCode:string)=>{

    }
    return{
      variables,
      activeNames,
      deal,
      data,
      spinning,
      seeQuantity
    }
  }
});
</script>
<style lang="less">
.title{
    background-color: aqua;
    text-align: center
}
</style>